﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>无标题页</title>
    <script type="text/javascript">
    function LoadData()
    {
        var tablelink = document.getElementById("tablelink");
        var data = {"百度":"http://www.baidu.com","新浪":"http://www.sina.com","苏大":"http:www.suda.edu.cn"};
        
        for(var key in data)
        {
            var value = data[key];
            var tr = document.createElement("tr");
            
            var td1 = document.createElement("td");
            td1.innerText = key;
            tr.appendChild(td1);
            
            var td2 = document.createElement("td");
            td2.innerHTML = "<a href="+value+">"+value+"</a>";
            tr.appendChild(td2);
            
            tablelink.tBodies[0].appendChild(tr);
        }
    }
    
    function LoadData2()
    {
        var tablelink = document.getElementById("tablelink");
        var data = {"百度":"http://www.baidu.com","新浪":"http://www.sina.com","苏大":"http:www.suda.edu.cn"};
        
        for(var key in data)
        {
            var value = data[key];
            var tr = tablelink.tBodies[0].insertRow(-1);
           
            var td1 = tr.insertCell(-1);    //-1代表在最后插入单元格
            td1.innerHTML = key;    //Firefox不支持innerText
            
            var td2 = tr.insertCell(-1);
            td2.innerHTML = "<a href="+value+">"+value+"</a>";
        }
    }
    </script>
</head>
<body>
<table id="tablelink">
<tbody>
</tbody>
</table>
<input type="button" value="改进版1" onclick="LoadData()"/>
<input type="button" value="改进版2" onclick="LoadData2()"/>
</body>
</html>
